<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<div id="box1"></div>
		<button type="button" id="btn01">读取样式</button>
	</body>
</html>
<script type="text/javascript">
	var box1 = document.getElementById("box1");
	var btn01 = document.getElementById("btn01");
	btn01.onclick = function(){
		// getComputedStyle(元素,null) 获取元素当前显示的样式
		// 只读，无法修改
		console.log(getComputedStyle(box1,null))
		alert(getComputedStyle(box1,null)backgroundColor)
		
	}
</script>
<style type="text/css">
	#box1{
		width: 12.5rem;
		height: 12.5rem !important;
		background-color: red;
	}
</style>
